import { Button } from "react-native";

import React from "react";
// 核心内容包
import { NavigationContainer } from "@react-navigation/native";
import { createNativeStackNavigator } from "@react-navigation/native-stack";
import { HeaderBackButton } from "@react-navigation/elements";
import Icon from "react-native-vector-icons/FontAwesome";
import { useNavigation } from "@react-navigation/native";

// 路由组件
import Index from "./screens/Tabbar/Index";
import Details from "./components/Details";
import Login from "./screens/Login/Login";
import Register from "./screens/Register/Register";
import UserDetail from "./screens/UserDetails/UserDetails";
import UserEditor from "./screens/UserEditor/UserEditor";
import UserEditorForm from "./screens/UserEditor/UserEditorForm";
import DeynamicDetails from "./screens/Dynamic/DeynamicDetails";
import DynamicPublic from "./screens/Dynamic/DynamicPublic";

// 引入路由表
import { Routes } from "./router/index";

const Stack = createNativeStackNavigator();

function AppRoutes() {
  const navigation = useNavigation();
  return (
    <Stack.Navigator
      initialRouteName="Login"
      screenOptions={{
        headerLargeStyle: {
          backgroundColor: "#fff",
        },
        headerBackTitleStyle: {
          fontSize: 10,
        },
      }}
    >
      {Routes.map((item) => {
        console.log(item);
        return (
          <Stack.Screen
            key={item.name}
            name={item.name}
            options={item.options}
            component={item.component}
          />
        );
      })}
    </Stack.Navigator>
  );
}

// 创建路由
export default function App() {
  return (
    // <SafeAreaView >
    <NavigationContainer>
      <AppRoutes />
    </NavigationContainer>
    // </SafeAreaView>
  );
}
